<template>
	<view >
		<view class="pagebgf" v-show="!loadingone" :style="planArr.length <=0?'background:#f5f5f5':''">
			<navbar name="健康计划"></navbar>
			<view v-for="(item,idx) in planArr" :key="idx" @tap.stop="details(item,idx)">
				<view class="planArrView" >
					<view class="weui-flex">
						<view class="weui-flex__item">
							<view class="placeholder ellipsis" style="width: 500upx;">
								{{item.taskDesc}}
							</view>
						</view>
						<view>
							<view class="placeholder">
								<view class="weui-flex">
									<view class="weui-flex__item">
										<view class="placeholder ranone">
										</view>
									</view>
									<view>
										<view class="placeholder rantwo">
										</view>
									</view>
									<view>
										<view class="placeholder rantwo">
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="weui-flex imgagecen">
					<view class="lazy-load">
						<u-lazy-load border-radius="36rpx 0 0 36rpx" height="260" img-mode="aspectFill"
							:image="item.taskImage"></u-lazy-load>
					</view>
					<view class="txtRi">
						<view class="txtnum">
							{{item.taskPeriod}}
						</view>
						计划天数
					</view>
				</view>
			</view>
			<view class="no-plan" v-if="planArr.length <=0">
				<view class="plan-bgimage">
				</view>
				<text>
					暂无计划
				</text>
			</view>
		</view>
		<view class="loading-box">
			<u-loading :show="loadingone" color="#41ADBA" size="70"></u-loading>
		</view>
	</view>
</template>

<script>
import uLoading from "@/uview-ui/components/u-loading/u-loading.vue"
import uLazyLoad from "@/uview-ui/components/u-lazy-load/u-lazy-load.vue"

	export default {
		components: {
			uLazyLoad,
			uLoading,
		},
		data() {
			return {
				loadingone:true,
				planArr: [
				],
				pageNo:1,
				pageSize:4,
			}
		},
		onLoad() {
			this.task(this.pageNo,this.pageSize)
		},
		methods:{
			task(pageNo,pageSize){
				let _this = this;
				_this.loadingone = true;
				this.$api.get(global.apiUrls.task + pageNo+'/'+pageSize, {})
					.then(res => {
						if(res.data.code == 1000){
							let records = res.data.result.records;
							_this.planArr = records;
							_this.loadingone = false;
						}else{
							uni.showToast({
								title: res.data.message,
								icon: "none",
								duration: 2000
							});
						}
					}).catch(err => {})
			},
			details(item,idx){
				uni.navigateTo({
					url:'/pages/subpackage/find/planDetails/planDetails?taskId='+item.taskId
				})
			}
		}
	}
</script>

<style lang="scss">
	@import "../basescss/basescss.scss"
</style>
